<template>
  <div class="lunbo">
		    <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
		  <!-- Indicators -->
			  <ol class="carousel-indicators">
			    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
			    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
			    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
			    <li data-target="#carousel-example-generic" data-slide-to="3"></li>
			    <li data-target="#carousel-example-generic" data-slide-to="4"></li>


			  </ol>

			  <!-- Wrapper for slides -->
			  <div class="carousel-inner" role="listbox">
			    <div class="item active">
			      <img src="http://p4.music.126.net/y-1OPHCX4_zGUB3Yz2iWng==/18807146394954931.jpg" alt="...">
			      <div class="carousel-caption">
			      
			      </div>
			    </div>
			    <div class="item">
			      <img src="http://p3.music.126.net/y8FwET12IIW9F_kXsrITlQ==/19188676927987557.jpg" alt="...">
			      <div class="carousel-caption">
			     
			      </div>
			    </div>
			    <div class="item">
			      <img src="http://p4.music.126.net/zLxnUXwrP8b_mHnHcQbMLQ==/18886311230348555.jpg" alt="...">
			      <div class="carousel-caption">
			     
			      </div>
			    </div>
			    <div class="item">
			      <img src="http://p4.music.126.net/N6FRDcxSP6nIPnZiHqL0bg==/19189776439614383.jpg" alt="...">
			      <div class="carousel-caption">
			     
			      </div>
			    </div>
			    <div class="item">
			      <img src="http://p3.music.126.net/y8FwET12IIW9F_kXsrITlQ==/19188676927987557.jpg" alt="...">
			      <div class="carousel-caption">
			     
			      </div>
			    </div>

			   
			  </div>

			  <!-- Controls -->
			  <a class="left carousel-l" href="#carousel-example-generic" role="button" data-slide="prev">
			    <span class="glyphicon glyphicon-menu-left" aria-hidden="true"></span>
			    <!-- <span class="sr-only">Previous</span> -->
			  </a>
			  <a class="right carousel-r" href="#carousel-example-generic" role="button" data-slide="next">
			    <span class="glyphicon glyphicon-menu-right" aria-hidden="true"></span>
			    <span class="sr-only">Next</span>
			  </a>
			</div>
  </div>
</template>

<script>

export default {
  name: 'lunbo',
  data () {
    return {
   		items:[{src:"http://p4.music.126.net/y-1OPHCX4_zGUB3Yz2iWng==/18807146394954931.jpg"},
   		{src:"http://p4.music.126.net/y-1OPHCX4_zGUB3Yz2iWng==/18807146394954931.jpg"},
   		{src:"http://p4.music.126.net/y-1OPHCX4_zGUB3Yz2iWng==/18807146394954931.jpg"},
   		{src:"http://p4.music.126.net/y-1OPHCX4_zGUB3Yz2iWng==/18807146394954931.jpg"},
   		{src:"http://p4.music.126.net/y-1OPHCX4_zGUB3Yz2iWng==/18807146394954931.jpg"},
   		{src:"http://p4.music.126.net/y-1OPHCX4_zGUB3Yz2iWng==/18807146394954931.jpg"},]

    }
    
  }
 
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.lunbo{
	width: 730px;
	height: 336px;
}
.carousel-l{
	position: absolute;
	left: -36px;
	top: 160px;
	font-size: 35px;
}
.carousel-r{
	position: absolute;
	right: -289px;
	top: 160px;
	font-size: 35px;

}

</style>
